﻿<html lang="zh-CN">
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8" >
<head>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>文章 - 烫烫博客管理</title>
<link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/css/style.css">
<link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css">
<link rel="apple-touch-icon-precomposed" href="/img/icon/icon.png">
<link rel="Shortcut Icon" href="favicon.ico" type="image/ico">
<script src="/js/jquery-2.1.4.min.js"></script>
<!--[if gte IE 9]>
  <script src="/js/jquery-1.11.1.min.js" type="text/javascript"></script>
  <script src="/js/html5shiv.min.js" type="text/javascript"></script>
  <script src="/js/respond.min.js" type="text/javascript"></script>
  <script src="/js/selectivizr-min.js" type="text/javascript"></script>
<![endif]-->
<!--[if lt IE 9]>
  <script>window.location.href='upgrade-browser.html';</script>
<![endif]-->
</head>

<body class="user-select">
<section class="container-fluid">
  <header>
    <nav class="navbar navbar-default navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">切换导航</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
          <a class="navbar-brand" href="/">烫烫</a> </div>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="/logout" onClick="if(!confirm('是否确认退出？'))return false;">退出登录</a></li>
          </ul>
          <form action="" method="post" class="navbar-form navbar-right" role="search">
            <div class="input-group">
              <input type="text" class="form-control" autocomplete="off" placeholder="键入关键字搜索" maxlength="15">
              <span class="input-group-btn">
              <button class="btn btn-default" type="submit">搜索</button>
              </span> </div>
          </form>
        </div>
      </div>
    </nav>
  </header>
  <div class="row">
    <aside class="col-sm-3 col-md-2 col-lg-2 sidebar">
      <ul class="nav nav-sidebar">
        <li><a href="/adminindex.html">关于</a></li>
      </ul>
      <ul class="nav nav-sidebar">
        <li class="active"><a href="/show-article.html">文章</a></li>
      </ul>
      <ul class="nav nav-sidebar">
        <li><a href="/category.html">分类</a></li>
      </ul>
      <ul class="nav nav-sidebar">
        <li><a href="/tag.html">标签</a></li>
      </ul><ul class="nav nav-sidebar">
      <li><a href="/link.html">友链</a></li>
    </ul>
    </aside>
    <div class="col-sm-9 col-sm-offset-3 col-md-10 col-lg-10 col-md-offset-2 main" id="main">
      <form  method="post" >
        <h1 class="page-header">操作</h1>
        <ol class="breadcrumb">
          <li><a href="/add-article.html">增加文章</a></li>
        </ol>
        <h1 class="page-header">管理 <span class="badge"></span></h1>
        <input id="refresh" style="display: none" type="button" value="刷新">
        <div class="table-responsive">
          <table class="table table-striped table-hover">
            <thead>
              <tr>
                <th width="40dp"><span class="glyphicon glyphicon-paperclip"></span> <span class="visible-lg">ID</span></th>
                <th width="250dp"><span class="glyphicon glyphicon-file"></span> <span class="visible-lg">标题</span></th>
                <th width="80dp"><span class="glyphicon glyphicon-list"></span> <span class="visible-lg">分类</span></th>
                <th width="80dp" class="hidden-sm"><span class="glyphicon glyphicon-tag"></span> <span class="visible-lg">标签</span></th>
                <th width="50dp" > <span class="visible-lg">浏览量</span></th>
                <th width="80dp" > <span class="visible-lg">推荐值(0-10)</span></th>
                <th width="80dp"><span class="glyphicon glyphicon-time"></span> <span class="visible-lg">日期</span></th>
                <th width="80dp"><span class="glyphicon glyphicon-pencil"></span> <span class="visible-lg">操作</span></th>
              </tr>
            </thead>
            <tbody id="tbody-result">
              <div id="doing"></div>
            </tbody>
          </table>
        </div>
        <footer class="message_footer">
          <nav>
            <div class="btn-toolbar operation" role="toolbar">
              <div class="btn-group" role="group">
                <a class="btn btn-default" onClick="select()">全选</a>
                <a class="btn btn-default" onClick="reverse()">反选</a>
                <a class="btn btn-default" onClick="noselect()">不选</a> </div>
              <div class="btn-group" role="group">
                <button type="submit" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="删除全部选中" name="checkbox_delete">删除</button>
              </div>
            </div>
            <ul id="ul-page" class="pagination pagenav">

            </ul>
          </nav>
        </footer>
      </form>
    </div>
  </div>
</section>

<script src="/js/bootstrap.min.js"></script>
<script src="/js/admin-scripts.js"></script>
<script>


function refre(page) {
    $.ajax({
        url : "/article/selectAllArticles",
        type : "POST",
        dataType: 'json',
        data: {
                "topage":page,
                "perpage":12
        },
        beforeSend:function(XMLHttpRequest){
            $("#doing").html("正在加载，请稍后···");
        },
        success:function(data) {
            <!-- 处理后端返回的数据 -->
            $("#doing").html("");
            var str = "";
            var tbody=window.document.getElementById("tbody-result");
            for (i in data.articles) {
                str += "<tr id="+data.articles[i].articleid+">" +
                    "<td width=\"40dp\" class=\"article-title\">"+data.articles[i].articleid+"</td>"+
                    "<td width=\"250dp\" class=\"article-title\">"+data.articles[i].title+"</td>"+
                    "<td width=\"80dp\" class=\"hidden-sm\">"+data.articles[i].category.categoryname+"</td>"+
                    "<td  width=\"80dp\">"+data.articles[i].grouptags+"</td>"+
                    "<td width=\"50dp\">"+data.articles[i].click+"</td>"+
                    "<td width=\"80dp\">"+data.articles[i].weight+"</td>"+
                    "<td width=\"80dp\">"+data.articles[i].date+"</td>"+
                    "<td width=\"80dp\"><a href=\"add-article.html?id="+data.articles[i].articleid+"\">修改</a>   <a onclick='deleteArticleById("+data.articles[i].articleid+")' >删除</a></td>"+
                    "</tr>";
            }
            tbody.innerHTML = str;

            str="";
            curPage=data.page;
            totalPages=data.totalPages;

            //  << 前一页
            if(curPage-1<1)
                str+="<li class='disabled'><a aria-label=\"Previous\" > <span aria-hidden=\"true\">&laquo;</span> </a> </li>";
            else
                str+="<li><a onclick='refre(curPage-1)' aria-label=\"Previous\" > <span aria-hidden=\"true\">&laquo;</span> </a> </li>";

            //以下判断语句保证最多显示5个li
            if(totalPages<5){
                classs="";
                for(var i=1;i<=totalPages;i++)
                {
                    if(i==curPage){
                        classs="active";
                    }else {
                        classs="";
                    }
                    str+="<li class="+classs+"><a onclick='refre("+i+")'>"+i+"</a></li>";
                }
            }else{
                classs="";
                min=curPage-2<1?1:curPage-2;
                max=curPage+2>totalPages?totalPages:curPage+2;
                if(min==1){
                    if(curPage+4>totalPages) {
                        max = totalPages;
                        min=totalPages-4;
                    }else{
                        max=5;
                    }
                }
                if(max==totalPages){
                    min=totalPages-4;
                }
                for(var i=min;i<=max;i++)
                {
                    if(i==curPage){
                        classs="active";
                    }else{
                        classs="";
                    }
                    str+="<li class="+classs+"><a onclick='refre("+i+")'>"+i+"</a></li>"
                }
            }
            //  >> 后一页
            if(curPage+1>totalPages)
                str+="<li  class='disabled'><a aria-label=\"Next\"> <span aria-hidden=\"true\">&raquo;</span> </a> </li>";
            else
                str+="<li><a onclick='refre(curPage+1)' aria-label=\"Next\"> <span aria-hidden=\"true\">&raquo;</span> </a> </li>";


            var ul=window.document.getElementById("ul-page");
            ul.innerHTML = str;

        },
        error:function(date){
            $("#doing").html("");
            window.alert("刷新失败")
        }
    });
}


//是否确认删除
function deleteArticleById(id){
  if(window.confirm("此操作不可逆，是否确认？"))
  {
      $.ajax({
          type: "POST",
          url: "/article/delectArticle",
          data: "id=" + id,
          cache: false, //不缓存此页面
          success: function (data) {
              if(data==1){
                  var tr=document.getElementById(id);
                  tr.style.display="none";
              }else{
                  window.alert('删除失败');
              }
          },
          error: function () {
              window.alert('删除失败');
          }
      });
  }
}

  $(document).ready(function read(e) {
      refre(1);
  });

</script>
</body>
</html>
